<script setup>
import axios from 'axios';
import { onMounted } from 'vue';
import { ref } from 'vue';
const student = ref([])

const getStudent = () => {
    axios({
        method: 'get',
        url: 'http://localHost:8080/course',
        withCredentials: true,
        params: {
            page: 1,
            pageSize: 10,
            courseName: null
        }
    }).then(function (response) {
        student.value = response.data.data.records
    })
}

onMounted(() => {
    getStudent()
})
</script>
<template>
    <div class="eamlist">
        <div class="title">
            <p>考试信息</p>
        </div>
        <div class="table">
            <div class="Head">
                <div class="name">考试名称</div>
                <div class="major">所属专业</div>
                <div class="beginTime">开始时间</div>
                <div class="endTime">结束时间</div>
            </div>
            <div class="tab" v-for="item in student" :key="item.id">
                <div class="name">{{ item.courseName }}
                </div>
                <div class="major">{{ item.majorName }}
                </div>
                <div class="beginTime">{{ item.courseStartTimestamp }}
                </div>
                <div class="endTime">{{ item.courseEndTimestamp }}
                </div>
            </div>
        </div>
    </div>
</template>
<style scoped>
.eamlist {
    width: 900px;
    margin: 5px;
}
.Head{
    display: flex;
    justify-content: space-around;
}
.tab{
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.Head>div, .tab>div{
    flex: 1;
    text-align: center;
}
</style>